<template>
  <div id="app">
    <Websocket ref="socket"></Websocket>
    <router-view v-if="isRouterAlive" />
    <theme-picker />
  </div>
</template>

<script>
import "@/assets/styles/table_style.scss";
import ThemePicker from "@/components/ThemePicker";
import { getToken, setToken } from '@/utils/auth';
import Websocket from "@/components/webSocket";
import Cookies from 'js-cookie';
// import socketMixin from "@/utils/socket.js";

export default {
  name: "App",
  // mixins: [socketMixin],
  components: { Websocket, ThemePicker },
  provide() {
    return {
      reload: this.reload
    }
  },
  data() {
    return {
      isRouterAlive: true,
    }
  },
  metaInfo() {
    return {
      title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
      titleTemplate: title => {
        return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
      }
    }
  },
  mounted() {
    // 根组件，只有F5刷新或者首次访问(这时正常cookie中没有值)这个系统的时候才会执行
    // console.log(Cookies.get('username'), 'this.$cookie')
    // return
    console.log(this.$quoWebsocket,'this.$quoWebsocket')
    if (Cookies.get('Admin-Token')) {
      this.$refs.socket.init()
    }
    addEventListener('message', (event) => {
      // console.log(event);
      let res = event.data;
      if (res.type == 'login') {
        console.log('子系统响应');
        this.$store.commit('SET_FIAG', true);
        this.$store.commit('SET_TOKEN', res.token);
        setToken(res.token);
        this.$router.push('/');
      }
    });
  },
  methods: {
    reload() {
      // 刷新界面使用，有更好的刷新体验效果
      this.isRouterAlive = false;
      this.$nextTick(function () {
        this.isRouterAlive = true;
      });

    }
  }
};
</script>
<style scoped>
#app .theme-picker {
  display: none;
}
</style>
